@font-face {
  font-family: "JetBrainsMono";
  src: url(/static/font/JetBrainsMono-Regular.ttf);
}

[container] {
  max-width: 1920px;
}

:root {
  font-size: 16px;
  font-family: 'JetBrainsMono,Helvetica,Arial,sans-serif';
}

h1,h2,h3,h4,h5,h6,p,span,div {
  font-family: 'JetBrainsMono,Helvetica,Arial,sans-serif';
}

/* .w-current-page-display {
  background: #4a4a4a;
} */

button,input, :root ::part(btn) {
  border-radius: 0.08rem;
}

.short-input, :root ::part(short-input) {
  width: 60%;
}

.middle-input, :root ::part(middle-input) {
  width: 80%;
}

.long-input, :root ::part(long-input) {
  width:100%;
}

.editor-area {
  min-height: 25rem;
  overflow: auto;
  margin-top: 0.15rem;
}

.btn-circle, :root ::part(btn-circle) {
  width: 2.64rem;
  height: 2.64rem;
  border-radius: 1.32rem;
  background-color: #f5f6f8;
  box-shadow: -0.12rem 0.2rem 0.23rem rgba(125, 125, 125, 0.56);
  line-height: 2.64rem;
  text-align: center;
  font-size: 89%;
  color: #4a4a4f;
  overflow: hidden;
  margin-left: 0.28rem;
  margin-right: 0.28rem;
  cursor: pointer;
  margin-bottom:0.36rem;
  user-select: none;
}

.btn-block, :root ::part(btn-block) {
  width: 2.8rem;
  height: 2rem;
  line-height: 2rem;
  border-radius: 0.25rem;
}

.btn-circle-orange {
  background: #ee5832;
  color: #424345;
}

.btn-circle-gray, :root ::part(btn-circle-gray) {
  background: #d1d2d5;
  color: #424345;
}

.btn-circle-light-gray, :root ::part(btn-circle-light-gray) {
  background: #dfdfe1;
  color: #424345;
}

.btn-circle-dark, :root ::part(btn-circle-dark) {
  background: #6a6a6a;
  color: #dfdfdf;
}

.btn-circle-dark-rgba, :root ::part(btn-circle-dark-rgba) {
  background: rgba(105, 105, 105, 0.58);
  color: #dfdfdf;
}

.btn-circle-ok, :root ::part(btn-circle-ok) {
  background: #4268df;
  color: #38373d;
}

.btn-circle-red {
  background: #ca4545;
  color: #424245;
}

.ok-btn {
  background: #3ca8bb;
  color: #424345;
}

input[type=submit] {
  background: #a84e70;
}

input[ok] {
  background: #1ba3a3;
}

.testok {
  background: #d9dde0;
}

.set-btn {
  background: #d3d2df;
  color: #424345;
}

.search-btn {
  background: #dcdce7;
  color: #424345;
}

.alert-btn {
  background: #787980;
  color: #fafafa;
}

.a-menu, :root ::part(a) {
  text-decoration: none;
  color: #4a4a59;
}

.spana,:root ::part(spana) {
  cursor: pointer;
  padding: 0.25rem;
  color: #4a4a68;
  line-height: 120%;
  user-select: none;
}

.spana-middle {
  font-size: 92%;
}

.spana-small {
  font-size: 86%;
}

.spana-tiny {
  font-size: 80%;
}

.align-center, [align-center], :root ::part(align-center) {
  text-align: center;
}

.align-left, [align-left] {
  text-align: left;
}

.align-right, [align-right], :root ::part(align-right) {
  text-align: right;
}

.alert-text, [alert-text] {
  color: #d93516;
}

.small, [small], :root ::part(small) {
  font-size: 85%;
}

.tiny, [tiny], :root ::part(tiny) {
  font-size: 80%;
}

.helper, [helper], :root ::part(helper) {
  font-size: 85%;
  color: #676869;
}

.italic, [italic], :root ::part(italic) {
  font-style: italic;
}

.helper-light, [helper-light], :root ::part(helper-light) {
  font-size: 86%;
  color: #dfdfe2;
}

.padding-25, [padding-25], :root ::part(padding-25) {
  padding: 0.25rem;
}

.padding-5, [padding-5], :root ::part(padding-5) {
  padding: 0.5rem;
}

.padding-8, [padding-8], :root ::part(padding-8) {
  padding: 0.8rem;
}

.padding, [padding], :root ::part(padding) {
  padding: 1rem;
}

.mtop5, [mtop5], :root ::part(mtop5) {
  margin-top: 0.5rem;
}

.mleft5,[mleft5], :root ::part(mleft5) {
  margin-left: 0.5rem;
}

.mright5,[mright5], :root ::part(mright5) {
  margin-right: 0.5rem;
}

.mbottom5,[mbottom5], :root ::part(mbottom5) {
  margin-bottom: 0.5rem;
}

.mtop, [mtop], :root ::part(mtop) {
  margin-top: 1rem;
}

.loadinfo-worker {
  border: 0.05rem solid #4556d5;
}

.loadinfo-master {
  border: 0.05rem solid #676869;
}

.image, :root ::part(image) {
  width: auto;
  height: auto;
  max-width: 100%;
  border-radius: 0.1rem;
}

.card-head, [card-head], :root ::part(card-head) {
  font-weight: 680;
}

.card, [card], :root ::part(card) {
  padding: 0.6rem;
  border-radius: 0.18rem;
  box-shadow: 0.2rem 0.2rem 0.2rem #efeff2;
  margin: 0.8rem auto;
}

.inset-shadow, [inset-shadow], :root ::part(inset-shadow) {
  box-shadow: 0px 0.1rem 1.2rem 0.1rem rgba(15, 15, 15, 0.1),inset 0px -0.1rem 0px 0px rgba(15,15,15,0.1);
}

.card-space, [card-space], :root ::part(card-space) {
  margin: 0.38rem auto;
}

.icon, [icon], :root ::part(icon) {
  width: 1.1rem;
  height: auto;
}

.icon-large, [icon-large], :root ::part(icon-large) {
  width: 1.6rem;
  height: auto;
}

.block {
  border: #e5e8e9 solid 0.05rem;
  padding: 0.35rem;
}

.select {
  background: #efeff2;
}

.select-blue {
  background: #5689f9;
}

.content-preview {
  padding: 0.25rem;
  margin-bottom: 1rem;
  margin-top: 0.8rem;
}

table {
  width: 100%;
}

.lh158, [lh158], :root ::part(lh158) {
  line-height: 158%;
}

.lh2, [lh2], :root ::part(lh2) {
  line-height: 200%;
}

.line, :root ::part(line) {
  width: 100%;
  height: 0.25rem;
  margin-bottom: 0.58rem;
  border-bottom: solid #cdcdcf 0.08rem;
}

.rotate, :root ::part(rotate) {
  animation: rotating 0.36s infinite;
}

@keyframes rotating {
  0% {transform: rotateZ(0deg);}
  15% {transform: rotateZ(60deg);}
  35% {transform: rotateZ(120deg);}
  55% {transform: rotateZ(180deg);}
  75% {transform: rotateZ(240deg);}
  95% {transform: rotateZ(300deg);}
  100% {transform: rotateZ(360deg);}
}

.blue-dark {
  color: #1573b6;
}

.blue, :root ::part(blue) {
  color: #2298ed;
}

.dark, :root ::part(dark) {
  color: #32373d;
}

.dark-light {
  color: #4f4f4f;
}

.red, :root ::part(red) {
  color: #cd5245;
}

.red-light, :root ::part(red-light) {
  color: #dc3c3c;
}

.red-dark, :root ::part(red-dark) {
  color: #b73333;
}

.orange, :root ::part(orange) {
  color: #F17F42;
}

.gray, :root ::part(gray) {
  color: #666666;
}

.editor-title {
  background: #565758;
  color: #dfdfdf;
}

.hide, :root ::part(hide) {
  display: none;
  visibility: hidden;
}

.click, [click], :root ::part(click) {
  cursor: pointer;
}

.select-none, [select-none], :root ::part(select-none) {
  user-select: none;
}

:root ::part(btn) {
  cursor: pointer;
  font-size: .83333rem;
  line-height: 2.25rem;
  padding: 0 1.5em;
  -webkit-transition: background-color .15s;
  transition: background-color .15s;
  white-space: nowrap;
}

:root ::part(border-red) {
  background-color: transparent;
  border: 1px solid #c65146;
  color: #c65146;
}

:root ::part(border-green) {
  border-color: #10a887;
  background-color: transparent;
  color: #10a887;
}

:root ::part(border-blue) {
  border-color: #66a1ee;
  background-color: transparent;
  color: #66a1ee;
}

:root ::part(btn-gray) {
  background-color: rgba(0,0,0,.15);
  display: inline-block;
  margin-left: 1.25em;
  padding: 0 1em;
  vertical-align: 0;
}

.center, [center], :root ::part(center) {
  display: grid;
  place-items: center;
}

.circle-image, [circle-image], :root ::part(circle-image) {
  border-radius: 50%;
}